<?php include_once 'layout/heard.php'?>
<?php
    if($ridersResult['status'] == 3){
        $ridersResult = [];
        $ridersResult['status'] = 3;
        $dis = 'disabled="disabled"';
    }else{
        $dis = '';
    }
?>
<body>
<style>.qsrz .box_bnt a.bnt_tj.gray{background-color: #A9A9A9}</style>
<div class="content head_bg">
	<div class="head">
        <a href="javascript:void(0)" class="return_ico" onclick="javascript:history.go(-1);"><span></span></a>
        <h1>元祖骑手认证</h1>
    </div>
</div>

<div class="content">
	<div class="qsrz">
    	<form  method="post" enctype="multipart/form-data" id="form1">
        	<div class="box">
                <div class="left">姓  名：</div>
                <div class="right">
                	<input name="name" type="text" class="text text1" value="<?php echo $ridersResult['name'];?>" placeholder="请输入真实姓名">
                </div>
            </div>
            <div class="box">
                <div class="left">昵  称：</div>
                <div class="right">
                    <input type="text" name="username" class="qsrz_text_bnt" value="<?php echo $ridersResult['username'];?>" placeholder="请输入昵称"/>
                </div>
            </div>

            <?php if($ridersResult['age'] > 0){
                $age = $ridersResult['age'];
            }else{
                $age = '';
            };?>
            <div class="box">
                <div class="left">年  龄：</div>
                <div class="right">
                    <input type="text" name="age" class="qsrz_text_bnt" value="<?php echo $age;?>" placeholder="请输入真实年龄"/>
                </div>
            </div>

            <div class="box">
                <div class="left">性  别：</div>
                <div class="right">
                    <?php
                    if($ridersResult['sex'] == 1){
                        $sex = '男';
                    }elseif($ridersResult['sex'] == 2){
                        $sex = '女';
                    }else{
                        $sex = '请选择...';
                    }
                    ?>
                    <input type="text" name="" class="qsrz_text_bnt" value="<?php echo $sex;?>" readonly id="showUserPicker" placeholder="请选择">
                    <input type="hidden" name="sex" class="qsrz_text_bnt" id="showUserPickerCode"  placeholder="性别代码">
                </div>
            </div>
            <div class="box">
                <div class="left">出生日期：</div>
                <div class="right">
                    <input type="text" id="birthday" onfocus="this.blur();" name="birth_date" value="<?php echo $ridersResult['birth_date'];?>" placeholder="请选择" class="btn qsrz_text_bnt">
                </div>
            </div>
            <div class="box">
                <div class="left">联系电话：</div>
                <div class="right">
                    <input type="text" name="tel" class="qsrz_text_bnt" id="tel" value="<?php echo $tel;?>" readonly/>
                </div>
            </div>
            <div class="box">
                <div class="left">常住地址：</div>
                <div class="right">
                    <input name=""   id="showCityPicker3" type="text" onfocus="this.blur();"  class="qsrz_text_bnt" value="<?php echo $ridersResult['province_name'].' '.$ridersResult['city_name'].' '.$ridersResult['area_name'];?>" placeholder="请选择常住地址">
                    <input name="address" type="text" class="text text1 text_top" value="<?php echo $ridersResult['address'];?>" placeholder="详细地址">
                    <input name="city" type="hidden" id="hiddenShowCityPicker3" class="text text1 text_top" placeholder="常住城市代码">
                </div>
            </div>
            <div class="box">
                <div class="left">服务城市：</div>
                <div class="right">
                    <input name=""  id="showCityPicker3_fwcs" type="text" onfocus="this.blur();" value="<?php echo $ridersResult['service_province_name'].' '.$ridersResult['service_city_name'].' '.$ridersResult['service_area_name'];?>" class="qsrz_text_bnt" placeholder="请选择服务城市">
                    <input name="service_city"  id="hiddenCityResult3_fwcs" onfocus="this.blur();"   type="hidden" class="qsrz_text_bnt" placeholder="服务城市代码">

                </div>
            </div>
            <div class="box">
                <div class="left">服务门店：</div>
                <div class="right">
                    <input type="text" id="showUserPicker_fwmd" onfocus="this.blur();" name="" <?php echo $dis ?> value="<?php echo $ridersResult['shopname'];?>" class="qsrz_text_bnt">
                    <input type="hidden" id="showUserPicker_fwmdCode" onfocus="this.blur();"  name="service_shop" class="qsrz_text_bnt" placeholder="服务门店代码">
                </div>
            </div>
            <div class="box">
                <div class="left">身份证号：</div>
                <div class="right">
                	<input name="id_card" type="text" id="id_card" value="<?php echo $ridersResult['id_card'];?>" class="text text1" placeholder="请输入正确身份证号">
                </div>
            </div>

            <div class="box">
                <div class="left">身份证照片：</div>
                <div class="right">
                    <div class="picbox">
                        <p>身份证正面 参考照片</p>
                        <?php if($ridersResult['card_front_img']){
                            echo '<div id="sfzzp_zm" class="sfzzp_zm_img"><img src="webroot/file/riders/'.$ridersResult['card_front_img'].'" id="img0"></div>';
                        }else{
                            echo '<div id="sfzzp_zm" class="sfzzp_zm_img" ><img src="webroot/riders/images/zm.jpg" id="img0"></div>';
                        };?>
                        <div class="sfzzp_zm_bnt">
                            <a href="javascript:;" id="sfzzp_zm_img1">立即上传正面</a>
                            <input type="file" name="file0" id="file0" multiple class="sfzzp_zm_ipt" />
                        </div>
                    </div>
                    <div class="picbox">
                        <p style=" padding-top:8px;">身份证反面 参考照片</p>
                        <?php if($ridersResult['card_back_img']){
                            echo '<div id="sfzzp_zm2" class="sfzzp_zm_img"><img src="webroot/file/riders/'.$ridersResult['card_back_img'].'" id="img02"></div>';
                        }else{
                            echo '<div id="sfzzp_zm2" class="sfzzp_zm_img" ><img src="webroot/riders/images/zm.jpg" id="img02"></div>';
                        };?>
                        <div class="sfzzp_zm_bnt">
                            <a href="javascript:;">立即上传反面</a>
                            <input type="file" name="file02" id="file02" multiple class="sfzzp_zm_ipt" />
                        </div>
                    </div>
                </div>
            </div>
            <div class="box picbox">
                <div class="left">健康证：</div>
                <div class="right">
                	<p>健康证 参考照片</p>
                    <?php if($ridersResult['health_cards']){
                        echo '<div id="sfzzp_zm3" class="sfzzp_zm_img"><img src="webroot/file/riders/'.$ridersResult['health_cards'].'" id="img03"></div>';
                    }else{
                        echo '<div id="sfzzp_zm3" class="sfzzp_zm_img" ><img src="webroot/riders/images/zm.jpg" id="img03"></div>';
                    };?>
                    <div class="sfzzp_zm_bnt">
                        <a href="javascript:;" >立即上传正面</a>
                        <input type="file" name="file03" id="file03" multiple class="sfzzp_zm_ipt" />
                    </div>
                </div>
            </div>
            <?php
            $jkz_start = $jkz_end = '';
            if(strtotime($ridersResult['jkz_start'] > 0) ){
                $jkz_start = strstr($ridersResult['jkz_start'], ' ',true);

            }
            if(strtotime($ridersResult['jkz_end']) > 0){
                $jkz_end = strstr($ridersResult['jkz_end'], ' ',true);
            }
            ?>
            <div class="box">
                <div class="left">健康证生效时间：</div>
                <div class="right">
                    <input type="text" id="jkz_start" name="jkz_start" onfocus="this.blur();"   value="<?php echo $jkz_start;?>" placeholder="请选择"  class="btn qsrz_text_bnt">
                </div>
            </div>

            <div class="box">
                <div class="left">健康证到期时间：</div>
                <div class="right">
                    <input type="text" id="jkz_end" name="jkz_end" onfocus="this.blur();"   value="<?php echo $jkz_end;?>" placeholder="请选择"  class="btn qsrz_text_bnt">
                </div>
            </div>

            <div class="box">
                <div class="left">简历：</div>
                <div class="right">
                	<textarea name="resume" cols="" rows=""  class="text text2"><?php echo $ridersResult['resume'];?></textarea>
                </div>
            </div>
            <div class="box">
                <div class="left">紧急联系人：</div>
                <div class="right">
                	<input name="urgency_cont_username" type="text" value="<?php echo $ridersResult['urgency_cont_username'];?>" class="text text1" placeholder="请输入紧急联系人姓名">
                </div>
            </div>
            <div class="box">
                <div class="left">紧急联系人电话：</div>
                <div class="right">
                	<input name="urgency_cont_username_tel"  type="tel" id="urgency_cont_username_tel" value="<?php echo $ridersResult['urgency_cont_username_tel'];?>" class="text text1" placeholder="请输入紧急联系人电话">
                </div>
            </div>
            <div class="box">
                <div class="left">与本人关系：</div>
                <div class="right">
                	<input name="urgency_relation" type="text" value="<?php echo $ridersResult['urgency_relation'];?>" class="text text1" placeholder="请输入与本人关系">
                </div>
            </div>

            <div class="box_bnt">
                <a href="?md=riders&cl=riders&at=personageInfo">取消认证</a>
                <?php
                if($ridersResult['status']  ==  0){
                    echo '<a class="bnt_tj" href="javascript:void(0)" style="background-color: #A9A9A9" Enabled="false">请耐心等待审核</a>';
                }else{
                    echo '<a class="bnt_tj" href="javascript:void(0)" id="sub">确认并提交</a>';
                }
                ?>
            </div>
        </form>
    </div>
</div>


<link href="webroot/riders/css/mui.picker.min.css" rel="stylesheet" type="text/css">
<link href="webroot/riders/css/mui.poppicker.css" rel="stylesheet" type="text/css">
<script src="webroot/riders/js/mui.min.js"></script>
<script src="webroot/riders/js/mui.picker.min.js"></script>
<script src="webroot/riders/js/mui.poppicker.js"></script>
<!--script src="webroot/riders/js/city.data-3.js"></script-->

<script>
    var r_statue = '<?php echo $ridersResult['status'];?>';
    $(function () {
        if($("#tel").val() == ''){
            alert("读取个人信息失败");
            location.href = '?md=riders&cl=riders&at=regriders';
        }
    })

    function checkPhone(phone){
        if(!(/^1[3-9]\d{9}$/.test(phone))){
            return false;
        }else{
            return true;
        }
    }

    function isCardNo(card) {
        var pattern = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
        if(pattern.test(card)){
            return true;
        }else {
            return false;
        }
    }

    var can_submit=true
    var s = 0;
    jQuery("#sub").click(function () {
        var formData = new FormData();
        var data = jQuery("#form1").serializeArray();
        var urgency_cont_username_tel = jQuery("#urgency_cont_username_tel").val();
        var idCard = jQuery("#id_card").val();
        var msg="信息不全";
        jQuery(data).each(function (k,v) {
             console.log(v)
            if(v.value && $.trim(v.value.length) > 0){
                s = 0;
                formData.append(v.name,v.value);
            }else{
              s = 1;
              switch (v.name) {
                 case 'name':msg="请输入真实姓名";break;
                  case 'username':msg="请输入昵称";break;
                  case 'age':msg="请输入真实年龄";break;
                  case 'sex':msg="请选择性别";break;
                  case 'birth_date':msg="请选择出生日期";break;
                  case 'city':msg="请选择常住地址";break;
                  case 'address':msg="请输入常住地址";break;
                  case 'service_city':msg="请选择服务城市";break;
                  case 'service_shop':msg="您选的服务城市无门市，请重新选择服务城市";break;
                  case 'id_card':msg="请输入正确身份证号";break;
                  case 'jkz_start':msg="请选择健康证生效时间";break;
                  case 'jkz_end':msg="请选择健康证到期时间";break;
                  case 'resume':msg="请输入简历";break;
                  case 'urgency_cont_username':msg="请输入紧急联系人";break;
                  case 'urgency_cont_username_tel':msg="请输入紧急联系人电话";break;
                  case 'urgency_relation':msg="请输入紧急联系人与本人关系";break;
              }
              return false;
            }
        });
        if(s == 1){
            popup(msg);
            return false;
        }



        if(checkPhone(urgency_cont_username_tel) == false){
            popup("紧急联系人手机号码错误");
            return false;
        }

        if(isCardNo(idCard) == false){
            popup("骑手身份证号有误");
            return false;
        }


        var animateimg0 = jQuery('#file0').get(0).files[0];
        var animateimg2 = jQuery('#file02').get(0).files[0];
        var animateimg3 = jQuery('#file03').get(0).files[0];
        if(r_statue != 3){
            if(animateimg0){
                var houzui0 = animateimg0.name.lastIndexOf('.');
                var ext0 = animateimg0.name.substring(houzui0, animateimg0.name.length).toUpperCase();
                if(ext0 !='.PNG' && ext0 !='.GIF' && ext0 !='.JPG' && ext0 !='.JPEG' && ext0 !='.BMP'){
                    popup("文件类型错误,请上传图片类型");
                    return false;
                }
            }else{
                popup("您尚未上传正确的身份证正面图片！");
                return false;
            }

            if(animateimg2){
                var houzui2 = animateimg2.name.lastIndexOf('.');
                var ext2 = animateimg2.name.substring(houzui2, animateimg2.name.length).toUpperCase();
                if(ext2 !='.PNG' && ext2 !='.GIF' && ext2 !='.JPG' && ext2 !='.JPEG' && ext2 !='.BMP'){
                    popup("文件类型错误,请上传图片类型");
                    return false;
                }
            }else{
                popup("您尚未上传正确的身份证反面图片！");
                return false;
            }

            if(animateimg3){
                var houzui3 = animateimg3.name.lastIndexOf('.');
                var ext3 = animateimg3.name.substring(houzui3, animateimg3.name.length).toUpperCase();

                if(ext3 !='.PNG' && ext3 !='.GIF' && ext3 !='.JPG' && ext3 !='.JPEG' && ext3 !='.BMP'){
                    popup("文件类型错误,请上传图片类型");
                    return false;
                }
            }else{
                popup("您尚未上传正确的健康证图片！");
                return false;
            }
        }
        formData.append('file0',animateimg0);
        formData.append('file02',animateimg2);
        formData.append('file03',animateimg3);

        if (can_submit) {
            can_submit=false
            var myThis = $(this);
            $(this).removeAttr('id');
            $(this).addClass("gray");
            $(this).html('提交中...');

            jQuery.ajax({
                url: "?md=riders&cl=riders&at=riders_approveSub",
                dataType: "json",
                type: "post",
                //async: false,
                cache: false,
                contentType: false,
                processData: false,
                data: formData,
                beforeSend: function () {
                    loading();
                },
                success: function (d) {
                    $(".loading").fadeOut();
                    if (d.status == 1) {
                        alert(d.msg);
                        location.href="?md=riders&cl=riders&at=hintSucceedMessage";
                    } else {
                        myThis.attr('id', 'sub');
                        can_submit=true;
                        myThis.removeClass("gray");
                        myThis.html('确认并提交');
                        alert(d.msg);
                        location.href = "#";
                    }

                }
            })
        }
    })

</script>

<!-------------选择出生日期-------------->
<!-------------选择出健康证到期时间-------------->
<!-------------选择健康证生效日期-------------->
<script>
    jQuery("#birthday").click(function () {
        var dtpicker = new mui.DtPicker({
            type: "date",
            beginDate: new Date(1940, 04, 25),
            endDate: new Date(2050, 04, 25),
            labels: ['年', '月', '日'],
        });

        dtpicker.show(function(e) {
            console.log(e);
            jQuery("#birthday").val(e);
        });
    });

    jQuery("#jkz_start").click(function () {
        var dtpicker = new mui.DtPicker({
            type: "date",
            beginDate: new Date(1940, 04, 25),
            endDate: new Date(2050, 04, 25),
            labels: ['年', '月', '日'],
        });

        dtpicker.show(function(e) {
            console.log(e);
            jQuery("#jkz_start").val(e);
        });
    });

    jQuery("#jkz_end").click(function () {
        var dtpicker = new mui.DtPicker({
            type: "date",
            beginDate: new Date(1940, 04, 25),
            endDate: new Date(2050, 04, 25),
            labels: ['年', '月', '日'],
        });

        dtpicker.show(function(e) {
            console.log(e);
            jQuery("#jkz_end").val(e);
        });
    });
</script>

<!-------------选择性别-------------->
<script>
    jQuery("#showUserPicker").click(function () {
        var picker = new mui.PopPicker();
        picker.setData([{value: "3", text: "请选择"}, {value: "1", text: "男"}, {value: "2", text: "女"}]);
        picker.pickers[0].setSelectedValue('1', 3000);
        picker.show(function(SelectedType) {
            console.log(SelectedType);
            jQuery("#showUserPicker").val(SelectedType[0].text);
            jQuery("#showUserPickerCode").val(SelectedType[0].value);
        })
    });
</script>



<!-------------选择常住地址-------------->
<script>
    jQuery.ajax({
        url:"?md=riders&cl=riders&at=citydata",
        dataType:"json",
        type:"post",
        success:function (area) {
            setAddress(area)
        }
    });

    var area_shop;
    function setAddress(area){
        jQuery("#showCityPicker3").click(function () {
            var picker = new mui.PopPicker({
                layer: 3
            });
            picker.setData(area)
            picker.show(function(SelectedItem) {
                console.log(SelectedItem);
                var province = SelectedItem[0].text;
                var city = SelectedItem[1].text;
                var area = SelectedItem[2].text;
                jQuery("#showCityPicker3").val(province+' '+city+' '+area);
                jQuery("#hiddenShowCityPicker3").val(SelectedItem[0].value+'_'+SelectedItem[1].value+'_'+SelectedItem[2].value);
            })
        });

        //-------------选择服务城市+门店--------------//
        jQuery("#showCityPicker3_fwcs").click(function () {
            var picker = new mui.PopPicker({
                layer: 3
            });
            picker.setData(area)
            picker.show(function(SelectedItem) {
                console.log(SelectedItem);
                var province = SelectedItem[0].text;
                var city = SelectedItem[1].text;
                var area = SelectedItem[2].text;
                jQuery("#showCityPicker3_fwcs").val(province+' '+city+' '+area);
                jQuery("#hiddenCityResult3_fwcs").val(SelectedItem[0].value+'_'+SelectedItem[1].value+'_'+SelectedItem[2].value);
                jQuery("#showUserPicker_fwmd").val('');
                jQuery("#showUserPicker_fwmdCode").val('');
                jQuery.ajax({
                    url:"?md=riders&cl=riders&at=getAreaShop",
                    dataType:"json",
                    data:{'area':SelectedItem[2].value},
                    type:"post",
                    success:function (a) {
                        if(a.result){
                            jQuery("#showUserPicker_fwmd").val();
                            jQuery("#showUserPicker_fwmd").attr('disabled',false);
                            area_shop = a.result;
                        }else{
                            jQuery("#showUserPicker_fwmd").val('该地区无门店');
                            jQuery("#showUserPicker_fwmd").attr('disabled',true)
                        }

                    }
                });

            })
        });

        //-------------选择服务门店--------------//
        jQuery("#showUserPicker_fwmd").click(function () {
            var picker = new mui.PopPicker();
            var data = new Array();
            $(area_shop).each(function (k,v) {
                data.push(v);
            });
            picker.setData(data);
            picker.pickers[0].setSelectedValue('02113', 3000);
            picker.show(function(SelectedType) {
                console.log(SelectedType);
                jQuery("#showUserPicker_fwmd").val(SelectedType[0].text);
                jQuery("#showUserPicker_fwmdCode").val(SelectedType[0].value);
            })
        });

    }

</script>


<!-------------上传身份证-------------->
<script type="text/javascript">


    $(function () {
        $('.sfzzp_zm_ipt').on('change',function (e) {
            var filePath = $(this).val(), //获取input的value,里面是文件的路径
                fileFormat = filePath.substring(filePath.lastIndexOf('.')).toLowerCase(),
                imgBase64 = '', //存储图片的base64
                maxSize = 1*1024*1024,  //默认是大于2MB的图片自动压缩
                imgObj =$(this).parents('.picbox').find(".sfzzp_zm_img img")
            fileObj =e.target.files[0]; //上传文件的对象,要这样写才行，用jquery写法获取不到对象
            console.log('实际图片大小'+fileObj.size);
            console.log('限制图片大小'+maxSize);
            //检查文件格式
            if(!fileFormat.match(/.png|.jpg|.jpeg|.gif/)){
                alert('文件类型错误,文件格式必须为:png/jpg/jpeg!');
                $(this).val('')
                return;
            }
            if(fileObj.size > maxSize){
                //调用函数,对图片进行压缩
                compress(fileObj,function (imgBase64) {
                    imgBase64 = imgBase64;
                    $(imgObj).attr('src',imgBase64);
                })
            }else{
                directTurnIntoBase64(fileObj,function (imgBase64) {
                    imgBase64 = imgBase64;
                    $(imgObj).attr('src',imgBase64);
                    console.log('大小没超过2M,不同进行压缩')
                });
            }
        });

        //不对图片进行压缩
        function directTurnIntoBase64(fileObj,callback) {
            var r = new FileReader();
            //转成base64
            r.onload = function () {
                imgBase64 = r.result;
                //   console.log(imgBase64);
                callback(imgBase64)
            }
            r.readAsDataURL(fileObj);//转成base64格式
        }

        //对图片进行压缩
        function compress(fileObj,callback) {
            if(typeof (FileReader) === 'undefined'){
                console.log("当前浏览器内核不支持base64图片压缩")
                directTurnIntoBase64(fileObj,callback);
            }else{
                try{
                    var reader = new FileReader();
                    reader.onload = function (e) {
                        var image = $('<img/>');
                        image.load(function () {
                            var squareW = 700,//定义画布大小,也就是图片压缩之后的像素
                                squareH = 600,
                                canvas = document.createElement('canvas'),
                                context = canvas.getContext('2d'),
                                imageWidth = 0, //压缩图片大小
                                imageHeight = 0,
                                offsetX = 0,
                                offsetY = 0,
                                data = '';
                            canvas.width = squareW;
                            canvas.height = squareH;
                            context.clearRect(0,0,squareW,squareH);

                            if(this.width > squareW){
                                imageWidth = Math.round(squareW);
                                imageHeight = squareH;
                                offsetX = Math.round((imageWidth-squareW)/2);
                            }else{
                                imageHeight = Math.round(squareH);
                                imageWidth = squareW;
                                offsetY = Math.round((imageHeight - squareH)/2)
                            }
                            context.drawImage(this,offsetX,offsetY,imageWidth,imageHeight);
                            var data = canvas.toDataURL('image/jpeg')
                            callback(data)
                        });
                        image.attr('src',e.target.result)
                    };
                    reader.readAsDataURL(fileObj);
                }catch (e) {
                    console.log('压缩失败!')
                    //调用不压缩方法
                    directTurnIntoBase64(fileObj,callback)
                }
            }
        }



    })

</script>
<?php include_once 'layout/rfooter.php'?>
